@charset "gb2312";
@import "common.scss";

.wrapper{
	background:url(#{$global_img}/login/loginBg.jpg) center center no-repeat;
	height:780px;
	overflow: hidden;
	.main{
		padding: 210px 0 0 0;
	}
	.loginBox{
		background: url(#{$global_img}/login/loginConBg.png) 0 0 no-repeat;
		width:747px;
		height: 361px;
		margin: 0 auto;
		overflow: hidden;
		display: block;
		.iLine{
			width: 1px;
			height: 200px;
			float: left;
			overflow: hidden;
			font-size: 0;
			line-height: 0;
			background:#d5d5d5;
			margin-top: 80px;
			margin: 80px 0 0 80px;
			display: inline;
		}
	}
}

.loginForm{
	width: 300px;
	float: left;
	padding: 10px 0 0 40px;
	dt{
		font-size: 24px;
		line-height: 54px;
		height: 54px;
		text-align: center;
	}
	dd{
		padding: 0 0 0 110px;
		margin-top: 10px;
		position: relative;
		.sTit{
			width: 95px;
			text-align: right;
			padding-right: 15px;
			line-height: 34px;
			height: 34px;
			position: absolute;
			top: 0;
			left: 0;
		}
		.codeTxt{
			padding-right: 100px;
			.sendCodeBtn{
				width: 90px;
				height: 34px;
				line-height: 34px;
				position: absolute;
				top: 0;
				right: 0;
				background:#d7d4c7;
				color: #333;
				text-align: center;
				font-size: 12px;
				@include setBorderRadius;
			}
			.sCode{
				position: absolute;
				top: 0;
				right: 0;
				width: 90px;
				.iPic{
					width: 66px;
					height: 28px;
					display: block;
					float: left;
					overflow: hidden;
					margin: 3px 0 0 0;
					display: inline;
					img{
						width: 100%;
						height: 100%;
						display: block;
					}
				}
				.aRefresh{
					width: 24px;
					height: 24px;
					overflow: hidden;
					float: left;
					text-align: center;
					line-height: 24px;
					color: #527a0b;
					margin: 5px 0 0 0;
					display: inline;
					@include setCssAttr("transition","transform 0.5s");
					&:hover{
						@include setCssAttr("transform","rotate(360deg)");
					}
				}
			}
		}
		.txtInput{
			border: 1px solid #bfbfbf;
			padding: 0 10px;
			display: block;
			line-height: 32px;
			height: 32px;
			background: #fff;
			@include setBorderRadius;
			input{
				width: 100%;
				border: 0 none;
				background: none;
				line-height: 24px;
				height: 24px;
				padding: 4px 0;
			}
		}
		.sCheckBox{
			line-height: 30px;
			height: 30px;
			overflow: hidden;
			display: block;
			padding: 5px 0;
			input{
				float: left;
				width: 14px;
				height: 14px;
				margin: 8px 5px 0 0;
				display: inline;
			}
		}
		.pFun{
			padding: 10px 0 0 0;
			.sCheckBox{
				float: left;
				width: auto;
				font-size: 12px;
			}
			.forgetBtn{
				font-size: 12px;
				float: right;
				line-height: 40px;
				height: 40px;
				color: #006ab3;
				&:hover{
					color: #cc3742;
				}
			}
		}
	}
}

.loginRight{
	float: left;
	width: 300px;
	.hasAccountNumber{
		line-height: 36px;
		height: 36px;
		text-align: center;
		span{
			font-size: 14px;
			padding: 135px 0 15px;
			display: block;
		}
		.loginBtn{
			width: 100px;
			margin: 0 auto;
		}
	}
	.otherLogin{
		text-align: center;
		a{
			color: #006ab3;
			&:hover{
				color: #cc3742;
			}
		}
		.sTit{
			padding: 140px 0 0 0;
			line-height: 30px;
			height: 30px;
			overflow: hidden;
			display: block;
		}
		.otherLogin{
			padding: 10px 0 0 0;
			span{
				display: block;
				line-height: 24px;
				height: 24px;
				overflow: hidden;
				text-align: left;
				padding-left: 85px;
				a{
					float: left;
					img{
						float: left;
						width: 24px;
						height: 24px;
					}
				}
			}
		}
	}
}

.findPassword{
	background: none;
	height: auto;
	.main{
		padding: 10px 0 0 0;
	}
	.mod_a{
		.th_a{
			line-height: 62px;
			height: 62px;
			text-align: center;
			padding: 30px 0;
			border-bottom: 2px solid #dadada;
			.sMark{
				float: none;
				display: inline-block;
				font-size: 30px;
			}
		}
		.tb_a{
			padding: 30px;
		}
		
	}
	.iLock{
		background: url(#{$global_img}/login/findPassword.png) -461px 0 no-repeat;
		width: 39px;
		height: 62px;
		display: inline-block;
		overflow: hidden;
		vertical-align: top;
		margin-right: 20px;
	}
	.pStep{
		span{
			width: 220px;
			height: 36px;
			line-height: 36px;
			position: relative;
			float: left;
			color: #f37400;
			background:#ffe47b;
			font-size: 16px;
			em{
				width: 50px;
				text-align: center;
				float: left;
			}
			.iArrow{
				background: url(#{$global_img}/login/findPassword.png) -17px 0 no-repeat;
				position: absolute;
				top: 0;
				right: 0;
				width: 16px;
				height: 36px;
				overflow: hidden;
			}
			&.cur{
				color: #fff;
				background:#ffcc01;
				.iArrow{
					background-position: -34px 0;
				}
			}
			&.curA{
				color: #fff;
				background:#ffcc01;
				.iArrow{
					background-position: 0 0;
				}
			}
		}
	}
	.dlForm{
		width: 280px;
		padding: 20px 0 0 0;
		dt{
			font-size: 16px;
			line-height: 50px;
			height: 50px;
		}
		dd{
			padding:0 0 20px 0;
			.global_input{
				line-height: 34px;
				height: 34px;
				input{
					padding: 6px 0;
					color: #999;
					font-size: 14px;
				}
			}
			&.code{
				padding-right: 160px;
				position: relative;
				.sCode{
					position: absolute;
					top: 0;
					right: 0;
					line-height: 36px;
					em{
						border: 1px solid #dddddd;
						@include setBorderRadius;
						width: 86px;
						height: 34px;
						float: left;
						overflow: hidden;
						img{
							width: 100%;
							height: 100%;
							display: block;
							vertical-align: top;
						}
					}
					a{
						float: left;
						color: #f37400;
						font-size: 12px;
						margin: 0 0 0 10px;
						display: inline;
					}
				}
			}
			.globalBtn_42{
				width: 100px;
				display: block;
			}
		}
	}
}





